/* COLOUR Switcher CSS */

.content {
padding:0;
margin: 0;
width:407px;
border:0px;
display: block;
box-shadow: 5px 5px 5px rgba(0,0,0,0);
-moz-box-shadow: 5px 5px 5px rgba(0,0,0,0);
-webkit-box-shadow: 5px 5px 5px rgba(0,0,0,0);}
	
#content_2, #content_3, #content_4, #content_5 { display:none; }

ol, ul {}

blockquote, q {quotes: none;}

blockquote:before, blockquote:after, q:before, q:after {
content: '';
content: none;}

/* remember to define focus styles! */
:focus {outline: 0;}

/* remember to highlight inserts somehow! */
ins {text-decoration: none;}

del {text-decoration: line-through;}

/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;}

/* end reset */



/* TAB CONTROLS */

#tabbed_box_1 {
/*display: none; This commented out to default swatches to visible and not need the activation button*/
margin: 0px;
padding-top: 370px;
width:407px;
position: bottom;
top: 0px;}


.tabbed_area {
/*border:1px solid #494e52;
background-color:#636d76;
padding:8px;*/}

ul.tabs {
padding:0px;
margin:0px;}

ul.tabs li {
display:inline;}

ul.tabs li a {
background: url('../images/greystripe.png') repeat;
border-left-width: 0px;
border-bottom-width: 0px;
border-right-width: 0px;
border-style: solid;
border-color: #cccccc;
display: inline-block;
width: 77px;
height: 78px;
padding-right:1px;
padding-bottom:3px;
/* text-indent: -9999px; < use if no text in tag*/}

ul.tabs li a {
font-family: 'Muli', Helvetica, Verdana, Arial, sans-serif;
font-size: 13px;
font-weight: bold;
color: #333333;
line-height: 16px;
text-decoration: none;}

ul.tabs li a:hover {border-color:#ff000;}

ul.tabs li a.active {
border-top:solid #ff3300;
border-top-width: 16px;}



/* COLOUR SWATCH CONTROLS */

#content_1 button, #content_2 button, #content_3 button, #content_4 button, #content_5 button {
margin: 0 0px 0px 0;
box-shadow: 0px 0px 0px rgba(0,0,0,0.3);
-moz-box-shadow: 0px 0px 0px rgba(0,0,0,0.3);
-webkit-box-shadow: 0px 0px 0px rgba(0,0,0,0.3);}

/* STATEMENT T */
.swatch-style-c1, .swatch-style-c2, .swatch-style-c3, .swatch-style-c4,.swatch-style-c5, .swatch-style-c6, .swatch-style-g1, .swatch-style-g2, .swatch-style-g3, .swatch-style-g4,.swatch-style-g5, .swatch-style-g6, 
/* 360 MERINO */
.swatch-style-3601, .swatch-style-3602, .swatch-style-3603, .swatch-style-3604, 
/* 170 MERINO */
.swatch-style-0, .swatch-style-1, .swatch-style-2, .swatch-style-3, .swatch-style-4, .swatch-style-5, .swatch-style-6, .swatch-style-7, .swatch-style-8, .swatch-style-9, .swatch-style-10, .swatch-style-11, .swatch-style-12, .swatch-style-13, .swatch-style-14, .swatch-style-15, .swatch-style-16, .swatch-style-17, .swatch-style-18, .swatch-style-19, .swatch-style-20, 
/* THREAD */
.swatch-style-21, .swatch-style-22, .swatch-style-23, .swatch-style-24, .swatch-style-25, .swatch-style-26, .swatch-style-27, .swatch-style-28, .swatch-style-29, .swatch-style-30, .swatch-style-31, .swatch-style-32, .swatch-style-33, .swatch-style-34, .swatch-style-35, .swatch-style-36, .swatch-style-37, 
/* DRILL */
.swatch-style-101, .swatch-style-101, .swatch-style-202, .swatch-style-303, .swatch-style-404, .swatch-style-505, .swatch-style-606, .swatch-style-707, .swatch-style-808, .swatch-style-909, .swatch-style-1000 {
display: block;
width: 81px;
height: 81px;
padding: 0;
margin: 0;
float: left;
text-indent: -9999px;}

/* m styles - CONTROLS THE COLOUR OVERLAY */
.m1Style, .m2Style, .m3Style, .m4Style, .m5Style, .m6Style {
display: none;
margin: 0;
padding: 0;
width: 407px;
height: 357px;
position: absolute;
top: -1px;
left: 0px;}